<template>
	<div id="tuijian-box">
		<div id="bendituijian">
			<span class="iconfont icon-bajiaoshangongnengiconai-"></span>
			<p>{{bdtj}}</p>
		</div>
		<div id="qingziluyou">
			<span class="iconfont icon-qinzi2"></span>
			<p>{{qinzi}}</p>
		</div>
		<div id="wenquan">
			<span class="iconfont icon-wenquan1"></span>
			<p>{{wenquan}}</p>
		</div>
		<div id="leyuan">
			<span class="iconfont icon-icon-"></span>
			<p>{{zhutileye}}</p>
		</div>
	</div>
</template>

<script>
	export default{
		name: 'tuijian',
		data(){
			return {
				bdtj: '本地推荐',
				qinzi: '亲子游',
				wenquan: '温泉热卖',
				zhutileye: '主题乐园'
			}
		}
	}
</script>

<style>
	#tuijian-box{width: 100%;height: 80px;display: flex;justify-content: space-around;}
	#bendituijian,#qingziluyou,#wenquan,#leyuan{width: 23%;height: 80px;text-align: center;padding: 10px;}
	#tuijian-box span{font-size: 40px;}
	#bendituijian span{color: #F4565D;}
	#leyuan span{color: #C481CB;}
	#qingziluyou span{color: #0099FF;}       
	#wenquan span{color: #F96E2C;}
</style>